/*
 * @Author: 郭招娣 10615594+guo-zhaodi@user.noreply.gitee.com
 * @Date: 2022-11-03 20:36:03
 * @LastEditors: 郭招娣 10615594+guo-zhaodi@user.noreply.gitee.com
 * @LastEditTime: 2022-11-04 20:02:26
 * @FilePath: \宏烨找房\agent\src\page\Message\index.jsx
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 */
import React, { useState, useEffect } from 'react'
import { ArrowLeft, Ellipsis, Search } from '@react-vant/icons';
import { useNavigate } from 'react-router-dom'
import { DropdownMenu, List, Picker, Tabs, SwipeCell, Button, Flex, Typography, Image } from 'react-vant'
import { httpMessage, httpDelMessage } from '../../api/message';
import './index.css'

const Message = () => {
    const [data, setData] = useState([]);
    const navigate = useNavigate();
    const back = () => {
        navigate('/home')
    }
    const getData = async () => {
        const res = await httpMessage('/agentMessage');
        console.log(res);
        setData(res.data.list)
    }
    useEffect(() => {
        getData()

    }, [])
    const delAgent = async (item) => {
        console.log(item.id);
        const res = await httpDelMessage('/delAgentMessage', { id: item.id });
        console.log(res);
        getData()
    }
    return (
        <div className='box'>
            <div className='topHouse'>
                <ArrowLeft onClick={() => back()} />
                <b>消息列表</b>
                <Ellipsis />
            </div>
            <div className="msg-main">
                <div className="msg-xuan">
                    <Tabs border type='jumbo'>
                        <Tabs.TabPane title="信息">

                            {
                                data && data.map((item, index) => {
                                    return (
                                        <div key={index}>
                                            <SwipeCell
                                                rightAction={
                                                    <Button style={{ height: '100%' }} square type="danger" onClick={() => { delAgent(item) }}>
                                                        删除
                                                    </Button>
                                                }
                                            >
                                                <div className='msg-main-item'>
                                                    <div className='msg-main-item-box'>
                                                        <div className='msg-msin-item-img'>
                                                            <img src={item.img} className="msg-img" />
                                                        </div>
                                                        <div className='msg-main-item-content'>
                                                            <div className="msg-main-item-content-top">
                                                                <span>{item.name}</span>
                                                                <span>{item.time}</span>
                                                            </div>
                                                            <div className="msg-main-item-content-talk">
                                                                {item.title}
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </SwipeCell>
                                            <div className='msg-main-item-bottom'></div>
                                        </div>
                                    )
                                })
                            }
                            {/* <div>
                                <SwipeCell
                                    rightAction={
                                        <Button style={{ height: '100%' }} square type="danger">
                                            删除
                                        </Button>
                                    }
                                >
                                    <div className='msg-main-item'>
                                        <div className='msg-main-item-box'>
                                            <div className='msg-msin-item-img'>
                                                <img src="https://w.wallhaven.cc/full/zx/wallhaven-zxzr6j.png" className="msg-img" />
                                            </div>
                                            <div className='msg-main-item-content'>
                                                <div className="msg-main-item-content-top">
                                                    <span>安静</span>
                                                    <span>上午7.00</span>
                                                </div>
                                                <div className="msg-main-item-content-talk">
                                                    你好， 你发布的房子，我想具体咨询一下。
                                                </div>
                                            </div>
                                        </div>

                                    </div>
                                </SwipeCell>
                                <div className='msg-main-item-bottom'></div>
                            </div>
                            <div>
                                <SwipeCell
                                    rightAction={
                                        <Button style={{ height: '100%' }} square type="danger">
                                            删除
                                        </Button>
                                    }
                                >
                                    <div className='msg-main-item'>
                                        <div className='msg-main-item-box'>
                                            <div className='msg-msin-item-img'>
                                                <img src="https://w.wallhaven.cc/full/zx/wallhaven-zxzr6j.png" className="msg-img" />
                                            </div>
                                            <div className='msg-main-item-content'>
                                                <div className="msg-main-item-content-top">
                                                    <span>安静</span>
                                                    <span>上午7.00</span>
                                                </div>
                                                <div className="msg-main-item-content-talk">
                                                    你好， 你发布的房子，我想具体咨询一下。
                                                </div>
                                            </div>
                                        </div>

                                    </div>
                                </SwipeCell>
                                <div className='msg-main-item-bottom'></div>
                            </div>
                            <div>
                                <SwipeCell
                                    rightAction={
                                        <Button style={{ height: '100%' }} square type="danger">
                                            删除
                                        </Button>
                                    }
                                >
                                    <div className='msg-main-item'>
                                        <div className='msg-main-item-box'>
                                            <div className='msg-msin-item-img'>
                                                <img src="https://w.wallhaven.cc/full/zx/wallhaven-zxzr6j.png" className="msg-img" />
                                            </div>
                                            <div className='msg-main-item-content'>
                                                <div className="msg-main-item-content-top">
                                                    <span>安静</span>
                                                    <span>上午7.00</span>
                                                </div>
                                                <div className="msg-main-item-content-talk">
                                                    你好， 你发布的房子，我想具体咨询一下。
                                                </div>
                                            </div>
                                        </div>

                                    </div>
                                </SwipeCell>
                                <div className='msg-main-item-bottom'></div>
                            </div>
                            <div>
                                <SwipeCell
                                    rightAction={
                                        <Button style={{ height: '100%' }} square type="danger">
                                            删除
                                        </Button>
                                    }
                                >
                                    <div className='msg-main-item'>
                                        <div className='msg-main-item-box'>
                                            <div className='msg-msin-item-img'>
                                                <img src="https://w.wallhaven.cc/full/zx/wallhaven-zxzr6j.png" className="msg-img" />
                                            </div>
                                            <div className='msg-main-item-content'>
                                                <div className="msg-main-item-content-top">
                                                    <span>安静</span>
                                                    <span>上午7.00</span>
                                                </div>
                                                <div className="msg-main-item-content-talk">
                                                    你好， 你发布的房子，我想具体咨询一下。
                                                </div>
                                            </div>
                                        </div>

                                    </div>
                                </SwipeCell>
                                <div className='msg-main-item-bottom'></div>
                            </div>
                            <div>
                                <SwipeCell
                                    rightAction={
                                        <Button style={{ height: '100%' }} square type="danger">
                                            删除
                                        </Button>
                                    }
                                >
                                    <div className='msg-main-item'>
                                        <div className='msg-main-item-box'>
                                            <div className='msg-msin-item-img'>
                                                <img src="https://w.wallhaven.cc/full/zx/wallhaven-zxzr6j.png" className="msg-img" />
                                            </div>
                                            <div className='msg-main-item-content'>
                                                <div className="msg-main-item-content-top">
                                                    <span>安静</span>
                                                    <span>上午7.00</span>
                                                </div>
                                                <div className="msg-main-item-content-talk">
                                                    你好， 你发布的房子，我想具体咨询一下。
                                                </div>
                                            </div>
                                        </div>

                                    </div>
                                </SwipeCell>
                                <div className='msg-main-item-bottom'></div>
                            </div>
                            <div>
                                <SwipeCell
                                    rightAction={
                                        <Button style={{ height: '100%' }} square type="danger">
                                            删除
                                        </Button>
                                    }
                                >
                                    <div className='msg-main-item'>
                                        <div className='msg-main-item-box'>
                                            <div className='msg-msin-item-img'>
                                                <img src="https://w.wallhaven.cc/full/zx/wallhaven-zxzr6j.png" className="msg-img" />
                                            </div>
                                            <div className='msg-main-item-content'>
                                                <div className="msg-main-item-content-top">
                                                    <span>安静</span>
                                                    <span>上午7.00</span>
                                                </div>
                                                <div className="msg-main-item-content-talk">
                                                    你好， 你发布的房子，我想具体咨询一下。
                                                </div>
                                            </div>
                                        </div>

                                    </div>
                                </SwipeCell>
                                <div className='msg-main-item-bottom'></div>
                            </div>
                            <div>
                                <SwipeCell
                                    rightAction={
                                        <Button style={{ height: '100%' }} square type="danger">
                                            删除
                                        </Button>
                                    }
                                >
                                    <div className='msg-main-item'>
                                        <div className='msg-main-item-box'>
                                            <div className='msg-msin-item-img'>
                                                <img src="https://w.wallhaven.cc/full/zx/wallhaven-zxzr6j.png" className="msg-img" />
                                            </div>
                                            <div className='msg-main-item-content'>
                                                <div className="msg-main-item-content-top">
                                                    <span>安静</span>
                                                    <span>上午7.00</span>
                                                </div>
                                                <div className="msg-main-item-content-talk">
                                                    你好， 你发布的房子，我想具体咨询一下。
                                                </div>
                                            </div>
                                        </div>

                                    </div>
                                </SwipeCell>
                                <div className='msg-main-item-bottom'></div>
                            </div>
                            <div>
                                <SwipeCell
                                    rightAction={
                                        <Button style={{ height: '100%' }} square type="danger">
                                            删除
                                        </Button>
                                    }
                                >
                                    <div className='msg-main-item'>
                                        <div className='msg-main-item-box'>
                                            <div className='msg-msin-item-img'>
                                                <img src="https://w.wallhaven.cc/full/zx/wallhaven-zxzr6j.png" className="msg-img" />
                                            </div>
                                            <div className='msg-main-item-content'>
                                                <div className="msg-main-item-content-top">
                                                    <span>安静</span>
                                                    <span>上午7.00</span>
                                                </div>
                                                <div className="msg-main-item-content-talk">
                                                    你好， 你发布的房子，我想具体咨询一下。
                                                </div>
                                            </div>
                                        </div>

                                    </div>
                                </SwipeCell>
                                <div className='msg-main-item-bottom'></div>
                            </div>
                            <div>
                                <SwipeCell
                                    rightAction={
                                        <Button style={{ height: '100%' }} square type="danger">
                                            删除
                                        </Button>
                                    }
                                >
                                    <div className='msg-main-item'>
                                        <div className='msg-main-item-box'>
                                            <div className='msg-msin-item-img'>
                                                <img src="https://w.wallhaven.cc/full/zx/wallhaven-zxzr6j.png" className="msg-img" />
                                            </div>
                                            <div className='msg-main-item-content'>
                                                <div className="msg-main-item-content-top">
                                                    <span>安静</span>
                                                    <span>上午7.00</span>
                                                </div>
                                                <div className="msg-main-item-content-talk">
                                                    你好， 你发布的房子，我想具体咨询一下。
                                                </div>
                                            </div>
                                        </div>

                                    </div>
                                </SwipeCell>
                                <div className='msg-main-item-bottom'></div>
                            </div> */}



                        </Tabs.TabPane>
                        <Tabs.TabPane title="公告">
                            <div className='msg-main-item'>
                                <div className='msg-main-item-box'>
                                    <div className='msg-main-item-content'>
                                        <div className='kuang'>
                                            <div className="msg-main-item-content-top">
                                                <span>五一放假通知</span>
                                                <span>上午7.00</span>
                                            </div>
                                            <div className="msg-main-item-content-talk">
                                                五一放假， 五二上班
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div className='msg-main-item'>
                                <div className='msg-main-item-box'>
                                    <div className='msg-main-item-content'>
                                        <div className='kuang'>
                                            <div className="msg-main-item-content-top">
                                                <span>五一放假通知</span>
                                                <span>上午7.00</span>
                                            </div>
                                            <div className="msg-main-item-content-talk">
                                                五一放假， 五二上班
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div className='msg-main-item'>
                                <div className='msg-main-item-box'>
                                    <div className='msg-main-item-content'>
                                        <div className='kuang'>
                                            <div className="msg-main-item-content-top">
                                                <span>五一放假通知</span>
                                                <span>上午7.00</span>
                                            </div>
                                            <div className="msg-main-item-content-talk">
                                                五一放假， 五二上班
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div className='msg-main-item'>
                                <div className='msg-main-item-box'>
                                    <div className='msg-main-item-content'>
                                        <div className='kuang'>
                                            <div className="msg-main-item-content-top">
                                                <span>五一放假通知</span>
                                                <span>上午7.00</span>
                                            </div>
                                            <div className="msg-main-item-content-talk">
                                                五一放假， 五二上班
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div className='msg-main-item'>
                                <div className='msg-main-item-box'>
                                    <div className='msg-main-item-content'>
                                        <div className='kuang'>
                                            <div className="msg-main-item-content-top">
                                                <span>五一放假通知</span>
                                                <span>上午7.00</span>
                                            </div>
                                            <div className="msg-main-item-content-talk">
                                                五一放假， 五二上班
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div className='msg-main-item'>
                                <div className='msg-main-item-box'>
                                    <div className='msg-main-item-content'>
                                        <div className='kuang'>
                                            <div className="msg-main-item-content-top">
                                                <span>五一放假通知</span>
                                                <span>上午7.00</span>
                                            </div>
                                            <div className="msg-main-item-content-talk">
                                                五一放假， 五二上班
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div className='msg-main-item'>
                                <div className='msg-main-item-box'>
                                    <div className='msg-main-item-content'>
                                        <div className='kuang'>
                                            <div className="msg-main-item-content-top">
                                                <span>五一放假通知</span>
                                                <span>上午7.00</span>
                                            </div>
                                            <div className="msg-main-item-content-talk">
                                                五一放假， 五二上班
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div className='msg-main-item'>
                                <div className='msg-main-item-box'>
                                    <div className='msg-main-item-content'>
                                        <div className='kuang'>
                                            <div className="msg-main-item-content-top">
                                                <span>五一放假通知</span>
                                                <span>上午7.00</span>
                                            </div>
                                            <div className="msg-main-item-content-talk">
                                                五一放假， 五二上班
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div className='msg-main-item'>
                                <div className='msg-main-item-box'>
                                    <div className='msg-main-item-content'>
                                        <div className='kuang'>
                                            <div className="msg-main-item-content-top">
                                                <span>五一放假通知</span>
                                                <span>上午7.00</span>
                                            </div>
                                            <div className="msg-main-item-content-talk">
                                                五一放假， 五二上班
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div className='msg-main-item'>
                                <div className='msg-main-item-box'>
                                    <div className='msg-main-item-content'>
                                        <div className='kuang'>
                                            <div className="msg-main-item-content-top">
                                                <span>五一放假通知</span>
                                                <span>上午7.00</span>
                                            </div>
                                            <div className="msg-main-item-content-talk">
                                                五一放假， 五二上班
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div className='msg-main-item'>
                                <div className='msg-main-item-box'>
                                    <div className='msg-main-item-content'>
                                        <div className='kuang'>
                                            <div className="msg-main-item-content-top">
                                                <span>五一放假通知</span>
                                                <span>上午7.00</span>
                                            </div>
                                            <div className="msg-main-item-content-talk">
                                                五一放假， 五二上班
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div className='msg-main-item'>
                                <div className='msg-main-item-box'>
                                    <div className='msg-main-item-content'>
                                        <div className='kuang'>
                                            <div className="msg-main-item-content-top">
                                                <span>五一放假通知</span>
                                                <span>上午7.00</span>
                                            </div>
                                            <div className="msg-main-item-content-talk">
                                                五一放假， 五二上班
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </Tabs.TabPane>
                    </Tabs>
                </div>
            </div>
        </div>
    )
}
export default Message;